import Vue from 'vue/dist/vue.esm' // 引入带编译器的版本

console.log(Vue)
new Vue({  // renderWatcher
  el: '#app',
  data: {msg: 'abc'},
  computed: {
    length () { // computedWatcher
      debugger
      return this.msg.length
    }
  },
  watch: { // userWatcher
    msg (value) {
      debugger
      console.log('msg变了', value)
    }
  },
  methods: {
    update () {
      this.msg += '--'
      Promise.resolve().then(() => {
        console.log(this.$refs.p.innerHTML, 2)
      })
      this.$nextTick(() => {
        console.log(this.$refs.p.innerHTML, 1)
      })
    }
  },
  render: function(h) {
    let vnode = (
      <div>
        <p ref="p">msg: {this.msg}</p>
        <p>length: {this.length}</p>
        <button onClick={this.update}>更新</button>
      </div>
    )
    return vnode
  }
})